@import "~@/styles/theme.less";

.ant-tooltip {
	.ant-tooltip-content {
		.ant-tooltip-inner {
			span {
				opacity: 1 !important;
				margin-left: 5px;
			}
		}
	}
}
.ant-modal-mask {
	background-color: rgba(0, 0, 0, 0.5);
}
input {
	caret-color: #363636;
}
.ant-btn {
	font-weight: normal;
}

.dashboard_layout {
	min-width: 1180px;
	min-height: 100%;
	height: 100%;
  min-height: 100vh;

	.ant-layout {
		background: #fff;
		background: transparent !important;
	}

	.modalBtnStyle {
		.ant-btn {
			padding: 0 38px;
			height: 38px;
			line-height: 38px;
		}
	}

	.ant-breadcrumb {
		.ant-breadcrumb-link {
			a {
				font-size: 12px;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: rgba(23, 30, 45, 0.45);
				line-height: 54px;
			}
		}
		.ant-breadcrumb-separator {
			color: rgba(23, 30, 45, 0.45);
			font-size: 12px;
			font-weight: 400;
		}
		.firtBreadCrum {
			color: #354052;
			font-size: 12px;
		}
		.detailBreadcrum {
			font-size: 12px;
			color: #7f8fa4;
			float: left;
			cursor: pointer;
			height: 48px;
			display: flex;
			align-items: center;
		}
		.detailBreadcrum + .ant-breadcrumb-separator {
			display: none;
		}
	}

  @menuColor: #09554A;
	.slider {
    background: #fff;
    height: 100vh;
		overflow: hidden auto;
		position: relative;
    border-bottom-right-radius: 30px;
    .ant-layout-sider-children {
      position: fixed;
      width: 180px;
      left: 0;
      top: 0;
      padding-top: 0;
    }
    // &.ant-layout-sider-collapsed {
    //   .List {
    //     padding-left: 0;
    //     .ant-menu-item {
    //       justify-content: center;
    //       padding: 0 !important;
    //       .anticon{
    //         margin-right: 0;
    //       }
    //     }
    //   }
    //   .menu-logo {
    //     background-image: url("~@/images/slider/logo.svg");
    //     background-size: auto;
    //   }
    // }
    .menu-logo {
      height: 85px;
      background: url("~@/images/slider/menu-logo.svg") center  no-repeat;
      background-size: 127px 42px;
      background-color: @menuColor;
      border-top-right-radius: 30px;
    }
    .ant-menu-inline, .ant-menu-vertical, .ant-menu-vertical-left {
      border: none;
    }
		.List {
			width: 100%;
      padding-left: 12px;
      background: @menuColor;
      min-height: calc(100% - 85px);
      transition: padding .3s;
			.ant-menu-item {
				position: relative;
				height: 50px;
				position: relative;
        margin: 0;
        background-color: @menuColor;
        color: #fff;
        transition: flex .3s;
        display: flex;
        align-items: center;
        &.ant-menu-item-selected {
          background: url("~@/images/slider/selected.svg")  center no-repeat;
          background-size: cover;
          background-color: @menuColor;
          color: @menuColor;
        }
        &:after {
          display: none;
        }
        .anticon {
          margin-right: 15px;
        }
			}
		}
		.ant-layout-sider-trigger {
			position: static;
		}
		.handle-collapsed {
			position: absolute;
			bottom: 0;
			height: 40px;
			left: 0;
			width: 100%;
			display: flex;
			justify-content: center;
			align-items: center;
			cursor: pointer;
      color: #fff;
			// &:hover {
			// 	.anticon {
			// 		color: @primary-color;
			// 	}
			// }
			.anticon {
				font-size: 18px;
			}
		}
	}
	.layout-header {
		.route-title {
			display: flex;
			align-items: center;
			font-size: 16px;
			color: #031129;
			a {
				margin-left: auto;
			}
			.help {
				font-size: 12px;
				color: #999999;
				margin-right: 20px;
				transition: color 0.3s;
				&:hover {
					color: @hoverColor;
				}
			}
		}
		.breadcrumb {
			position: relative;
			display: flex;
			align-items: center;
			.breadcrumb-section {
				color: #152935;
				font-size: 12px;
			}
			.link-click {
				font-family: PingFangSC-Regular;
				font-size: 12px;
				color: @primary-color;
			}
			.link-no-click {
				font-family: PingFangSC-Regular;
				font-size: 12px;
				color: #333333;
			}
			.breadcrumb-back {
				width: 24px;
				height: 24px;
				margin-right: 10px;
				cursor: pointer;
				background: #ffffff;
				border: 1px solid #d9d9d9;
				border-radius: 2px;
				border-radius: 2px;
				display: inline-block;
				position: relative;
				transition: all .3s;
				&::after,
				&::before {
					content: "";
					position: absolute;
					width: 9px;
					height: 1px;
					background: #555555;
				}
				&::after {
					right: 7px;
					top: 14px;
					transform: rotate(46deg);
				}
				&::before {
					right: 7px;
					top: 8px;
					transform: rotate(-43deg);
				}
				&:hover {
					border: 1px solid @primary-color;
					&::after,
					&::before {
						background: @primary-color;
					}
				}
				&:active {
					border: 1px solid @primary-color;
				}
			}
			.help-link {
				margin-left: auto;
				.help {
					font-size: 12px;
					color: #999999;
					transition: color 0.3s;
					&:hover {
						color: @hoverColor;
					}
				}
			}
		}
		.content {
			background: @basicBg;
      padding: 24px;
      position: relative;
      min-height: calc(100vh - 55px);
		}
		.noNinHeight {
			background: #efefef;
			padding: 24px;
		}
	}
}
.ant-layout {
	background: @basicBg;
}

.ant-radio-button-wrapper {
	&:hover {
		color: @primary-color !important;
		border-color: @primary-color !important;
    &:not(:first-child)::before {
      background-color: @primary-color;
    }
    & + .ant-radio-button-wrapper {
      &:not(:first-child)::before {
        background-color: @primary-color;
      }
    }
	}
  &-checked {
    // background: fade(@primary-color, 30%) !important;
    background: #E6F3F1 !important;
  }
}

.power {
	height: 20px;
  margin-top: 40px;
	.power-content {
		display: flex;
		justify-content: center;
		color:rgba(23, 30, 45, 0.25);
		position: absolute;
		bottom: 40px;
		width: 100%;
    line-height: 20px;
		left: 0;
		font-size: 14px;
	}
}
